<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function addEvent(object, name, handler)
{
    if (document.all)
        object.attachEvent("on"+name, handler);
    else
        object.addEventListener(name, handler, false);
}

function removeEvent(object, name, handler)
{
    if (document.all)
        object.detachEvent("on"+name, handler);
    else
        object.removeEventListener(name, handler, false);
}

function cancelEvent(event)
{
    if (document.all)
        event.cancelBubble = true;
    else
        event.stopPropagation();        
}

function load() {
  addEvent(
      document.getElementById('test'),
      'click',
      function(e){
        e = e || window;
        var targ;
        	if (e.target) targ = e.target;
        	else if (e.srcElement) targ = e.srcElement;
        	if (targ.nodeType == 3) // defeat Safari bug
        		targ = targ.parentNode;
            
        alert(targ.id);
      }
    );
}
window.onload = load;

</script>
<style>
#test {
  position: absolute;
  width: 400px;
  height: 400px;
  
  background: #eee;
}

#content {
  width: 200px;
  height: 200px;
  background: #ddd;
}
</style>
</head>
<body>

	<div id="test">
	  <div id="content">Hi</div>	
	</div>

</body>
</html>